﻿@model ScadaWeb.Model.ScadaEquipmentModel
@{
    ViewBag.Title = "历史统计数据查询";
    Layout = "~/Views/Shared/_LayoutList.cshtml";
}
<style>
    body {
        background-color: white;
    }
</style>
<!--模糊搜索区域-->
<div class="layui-row">
    <form class="layui-form layui-col-md12 ok-search" lay-filter="formTest">
        <input id="Id" name="Id" type="hidden" class="layui-input" value="@Model.Id" lay-filter>
        <input id="GroupId" name="GroupId" type="hidden" class="layui-input" value="@Model.GroupId" lay-filter>
        <input id="DeviceId" name="DeviceId" type="hidden" class="layui-input" value="@Model.DeviceId" lay-filter>
        <input id="ServerId" name="ServerId" type="hidden" class="layui-input" value="@Model.ServerId" lay-filter>
        <input id="CommunicationId" name="CommunicationId" type="hidden" class="layui-input" value="@Model.CommunicationId" lay-filter>
        <div class="layui-input-inline">
            <div id="paralist" style="width:350px;"></div>
        </div>
        <div class="layui-input-inline">
            <input class="layui-input" placeholder="开始日期" autocomplete="off" name="StartDate" id="StartDate" value="@DateTime.Now.AddDays(-1).ToString("yyyy-MM-dd HH:mm:ss")">

        </div>
        <div class="layui-input-inline">
            <input class="layui-input" placeholder="结束日期" autocomplete="off" name="EndDate" id="EndDate" value="@DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")">
        </div>
        <div class="layui-input-inline" style="width:80px;">
            <select name="Period" id="Period" placeholder="统计周期" style="width:80px;" lay-filter="aihao">

                <option value="1m">1分钟</option>
                <option value="10m" selected="">10分钟</option>
                <option value="30m">30分钟</option>
                <option value="1h">1小时</option>
                <option value="2h">2小时</option>
                <option value="4h">4小时</option>
                <option value="6">6小时</option>
                <option value="12h">12小时</option>
                <option value="24h">24小时</option>
                <option value="1d">1天</option>
                <option value="2d">2天</option>
                <option value="1w">1周</option>
                <option value="2w">2周</option>
            </select>
        </div>
        <div class="layui-input-inline" style="width:100px;">
            <select name="Method" id="Method" placeholder="统计方法" style="width:80px;" lay-filter="aihao2">

                <option value="MEAN">1算数平均值</option>
                <option value="MEDIAN" selected="">中间值(中位数)</option>
                <option value="SPREAD">最大最小差值</option>
                <option value="SUM">求和</option>
                <option value="MAX">最大值</option>
                <option value="MIN">最小值</option>
                <option value="STDDEV">标准偏差</option>

            </select>
        </div>
        @Html.SearchBtnHtml("查询")
        @Html.ResetBtnHtml()

    </form>
</div>
<!--数据表格-->
<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>

<script>
        var serieitems = JSON.parse('@MvcHtmlString.Create(Model.JsonParas)');
        for (var i = 0; i < serieitems.length; i++) {

            serieitems[i].name = serieitems[i].ParaTitle;
            serieitems[i].value = serieitems[i].ParaName;
            serieitems[i].selected = false;

        }
    layui.use(["table", "form", "okLayer", "okUtils", "treeSelect", "laydate"], function () {
        let table = layui.table;
        let form = layui.form;
        let treeSelect = layui.treeSelect;
        let okLayer = layui.okLayer;
        let okUtils = layui.okUtils;

        let startdate = layui.laydate;
        let enddate = layui.laydate;
        var $ = layui.$;
        var cols = [];
      

        startdate.render({
            elem: '#StartDate'
            , type: 'datetime'
        });
        enddate.render({
            elem: '#EndDate'
            , type: 'datetime'
        });
        let AllTable = table.render({
            elem: "#tableId",
            url: "/Scada/ScadaGeneral/EquipmentHistorySummaryData",
            limit: 1000,
            limits: [100, 200, 300, 500, 600, 800, 1000, 1500, 2000, 3000],
            width: document.body.clientWidth - 10,
            height: 'full-80',
            page: true,
            loading: true,
            id: 'HistoryGrid',
            toolbar: "#toolbarTpl",
            jump: function (obj, first) {
                if (!first) {
                    layer.msg('第 ' + obj.curr + ' 页');
                }
            },
            size: "sm",

            cols: [cols],
            done: function (res, curr, count) {

            },
            parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                var result = eval('(' + res + ')');
                return result;
            }
        });

        var series = xmSelect.render({
            el: '#paralist',
            filterable: true,
            paging: true,
            pageSize: 50,
            language: 'zn',
            data: serieitems,
            radio: false,
            on: function (data) {
                cols = [];
                cols.push({ field: "DateStampTime", title: "采集时间", width: 180 });
                for (var i = 0; i < data.arr.length; i++) {
                    cols.push({ field: data.arr[i].value, title: data.arr[i].name, width: 120, });
                }

                AllTable.config.cols = [cols];
            }
        });
        //数据表定时加载

        form.on("submit(search)", function (data) {
            var colnames = series.getValue('valueStr');
            data.field.Tag = colnames;


            AllTable.reload({
                where: data.field,
                page: { curr: 1 }

            });
            return false;
        });


        form.render(); //更新全部


    })
</script>



